<input id="btn_delete" type="button" value="Xóa" class="button_css3" />
<input id="btn_excelExport" type="button" value="Xuất Tập Tin Excel" class="button_css3" />

<div class="tb_general">
<table class="tb_general" id="tb_product">
			
	<tr>	
		<th class="text_center" style="width: 2%;">
			<span 
				class	= "icon_control icon_control_delete"
				id		= "span_delete"
			> </span>
		</th>
			
		<th style="width: 2%;">
			<span class	= "icon_control icon_control_panel"> </span>
		</th>
		
		<th style="width: 2%;">STT</th>
		
		<th data-name="subject"		data-sort="" onclick="sortData(this);" style="cursor: pointer;">Sản Phẩm</th>
		<th data-name="category"	data-sort="" onclick="sortData(this);" style="cursor: pointer;">Danh Mục</th>
		<th data-name="price"		data-sort="" onclick="sortData(this);" style="cursor: pointer;">Giá Tiền</th>
		<th data-name="vat"			data-sort="" onclick="sortData(this);" style="cursor: pointer;">VAT</th>
		<th data-name="insert"		data-sort="" onclick="sortData(this);" style="cursor: pointer;">Ngày Nhập</th>
	</tr>
		
	<tr id="tr_search">
		<td>
			<input
				id		= "chk_select_all"
				name	= "chk_select_all"
				type	= "checkbox"
				class	= "check_box"
			/>
		</td>
		
		<td class="text_center">
			<span 
				class	= "icon_control icon_control_apply"
				id		= "btn_filter"
			> </span>
		</td>
		
		<td></td>
		
		<td colspan="7">
			<input
				type	= "text"
				id		= "txt_filter"
				name	= "txt_filter"
				class	= "text_box"
				tabindex= "1"
				style	= "width: 99.4%;"
			/>
		</td>
	</tr>
		
	<tbody id="tbody_product"></tbody>
		
</table><!--End tb_general id:tb_product-->
</div><!--End tb_general-->
	
<div class="clear"></div>

<script type="text/javascript">
s_column = typeof s_column !== "undefined" ? s_column : "insert";
s_sort = typeof s_sort !== "undefined" ? s_sort : 'DESC';

$(document).ready(function () {

	$("#btn_delete").hide();

    load_list(1);
});

$("#btn_filter").click(function() {
	load_list(1);
});

$("#txt_filter").keypress(function(e) {
	if (e.keyCode == '13') {
		load_list(1);
	}
});

function sortData (element)
{
	s_column = $(element).attr("data-name");
	s_sort = $(element).attr("data-sort");
	var img_desc	= '<img id="img_sort" align="left" alt="ASC" src="">';
	var img_asc		= '<img id="img_sort" align="left" alt="DESC" src="">';

	$("#img_sort").remove();

	if( s_sort == "" )
	{
		$(element).attr("data-sort", "DESC");
		$(element).append(img_desc);
		s_sort = $(element).attr("data-sort");
	}
	else if (s_sort != "" && s_sort == "DESC")	
	{
		$(element).attr("data-sort", "ASC");
		$(element).append(img_asc);
		s_sort = $(element).attr("data-sort");
	}
	else if ( s_sort != "" && s_sort == "ASC" )
	{
		$(element).attr("data-sort", "");
		
		s_column = "insert";
		s_sort = "DESC";
	}
	
	load_list(1);
}


function load_list(i_page) {

	$("#dialog_excute").dialog( "open" );
	
	$.ajax({
		url		: "<?=Yii::app()->createUrl("product/listdetail");?>",
		type	: "POST",
		cache	: false,
		data	: {
			page: i_page,
			amountPerPage: 20,
			columnName: s_column,
			sortMethod: s_sort,
			txt_filter: $("#txt_filter").val()
		},
		dataType: "html",
		success	: function(html){

			$("#tbody_product").html("");
			$("#tbody_product").append(html);

			$("#dialog_excute").dialog( "close" );
		},
		error: function (){
			alert("Trang hiện hành không tồn tại.");
			$("#dialog_excute").dialog( "close" );
		}
	});
	
}

function call_edit_page(i_key) {
	$("#tr_"+i_key).css("background-color","#EFEFEF");
	$("#dialog_excute").dialog( "open" );

	$.ajax({
		url		: "<?=Yii::app()->createUrl("product/edit");?>",
		type	: "POST",
		cache	: false,
		data	: {i_key : i_key},
		success	: function(html){

			if(i_key == 0)
			{
				$("#div_contentBox").html(html);
				$("#dialog_excute").dialog( "close" );
			}
			else
			{
				//$("#tbody_product").html(html);
				$("#dialog_notice").children("#content").html(html);
				$("#dialog_excute").dialog( "close" );
				$("#dialog_notice").dialog("open");
			}
		},
		error: function (){
			alert("Trang hiện hành không tồn tại.");
			$("#dialog_excute").dialog( "close" );
		}
	});
}

function display_button(element) {

	if(element.checked == true) 
		$("#btn_delete").show();
	else
	{
		var arr_deleteId = $('#chk_delete:checked').serializeArray();
		if(arr_deleteId.length == 0)
			$("#btn_delete").hide();
	}
}

$("#chk_select_all").click(function() {

	if(this.checked == true){
		$("input[name='chk_delete']").each( function() {
			$(this).attr('checked', true);
		});
	}else {
		$("input[name='chk_delete']").each( function() {
			$(this).attr('checked', false);
		});
	}

	display_button(this);
});

$('#btn_delete, #span_delete').click(function() {
	
	if(confirm("Bạn muốn xóa các đối tượng đã chọn?")){

		$("#dialog_excute").dialog( "open" );
		
		$.ajax({
			url		: "<?=Yii::app()->createUrl("product/delete");?>",
			type	: "POST",
			cache	: false,
			data	: {
				arr_deleteId : $('#chk_delete:checked').serializeArray()
			},
			dataType: "html",
			success	: function(string) {

				var arr_result = $.parseJSON(string);

				if(arr_result.error != null){
					alert(arr_result.error);
					$("#dialog_excute").dialog( "close" );
					return;
				}

				var arr_deleteId = $('#chk_delete:checked').serializeArray();
				
				for ( var int = 0; int < arr_deleteId.length; int++) {
					$("#tr_"+ arr_deleteId[int].value).remove();
				}

				$("#dialog_excute").dialog( "close" );
			},
			error: function (){
				alert("Trang hiện hành không tồn tại.");
				$("#dialog_excute").dialog( "close" );
			}
		});
		
	}
	
});
</script>